<div class="grid">
    <div class="row">
        <div class="span5">
            <?php  
                $button = array("success","primary","warning");
                $i=0;
                foreach($query->result() as $q ) {  ?>
                <button class="shortcut span4 <?php echo $button[$i]; ?>" onclick="send(<?php echo $q->loket_id;?>,'<?php echo $q->loket_kode;?>' )" style="margin:20px 0 0 20px ;height:20%;">
                     <p class="subheader">
                         <i class="icon-screen"></i>
                         <?php echo $q->loket_nama;?>
                     </p>
                </button>
            <?php $i++; if($i >= count($button))$i=0; } ?>
        </div>
        
        <div class="span7">
            <p class="subheader text-center" style="margin-top:100px;">SELAMAT DATANG DI PELAYANAN JAMSOSTEK</p>
                
            <div class="response" style="display:none;">
                
                <p class="header text-center" style="margin-top:100px;">
                    No Antrian
                </p>
                <p class="header text-center" id="no-antrian" style="margin-top:100px;">
                    -
                </p>
            </div>
            
        </div>
        
    </div>
    
</div>


<script type="text/javascript">
    function send(id, kode){
       console.log(id);
         $.ajax({
            url : "<?php echo base_url('panel/send'); ?>",
            type: "POST",
            data : {
                'm_loket_id' : id,
                'loket_kode' : kode
            },
            success : function(response){
                $(".response").show();
                $("#no-antrian").html(response);
                $(".response").delay(5000);
                $(".response").hide("slow");
       //          $("#no-antrian").show().delay(10000).hide();
            }
        });
    }
</script>